import { login, getUser } from "@/api/user";
import { Commit, createStore } from "vuex";
import { testData, testPosts } from "@/testData";
import { getColumns, getColumn, getPosts } from "@/api/column";
import { axiosInstance } from "@/utils/request";
import { AxiosResponse } from "axios";
export interface UserProps {
    isLogin: boolean;
    nickName?: string;
    _id?: number;
    column?: number;
}
interface ImageProps {
    _id?: string;
    url?: string;
    createdAt?: string;
}
export interface ColumnProps {
    _id: string;
    title: string;
    avatar: ImageProps;
    description: string;
}
export interface PostProps {
    _id: string;
    title: string;
    excerpt?: string;
    content: string;
    image?: ImageProps;
    createdAt: string;
    column: string;
}
export interface GlobalErrorProps {
    status: boolean;
    message?: string;
}
export interface GlobalDataProps {
    error: GlobalErrorProps;
    token: string;
    loading: boolean;
    columns: ColumnProps[];
    posts: PostProps[];
    user: UserProps;
}
const requestAndCommit = async (api, mutationName: string, commit: Commit) => {
    const res = await api();
    commit(mutationName, res.data);
    return res;
};
export default createStore<GlobalDataProps>({
    state: {
        error: { status: false },
        token: localStorage.token || "",
        loading: false,
        columns: [],
        posts: [],
        user: { isLogin: false, nickName: "vansir", column: 1 },
    },
    getters: {
        getColumnById: (state: GlobalDataProps) => (id: string) => state.columns.find(c => c._id === id) || {},
        getPostsByCid: (state: GlobalDataProps) => (id: string) => state.posts.filter(column => column.column === id) || [],
    },
    mutations: {
        fetchCurrentUser(state, rawData) {
            state.user = { isLogin: true, ...rawData };
        },
        login(state, rawData) {
            // state.user = { ...state.user, isLogin: true, name: "vanisr" };
            state.token = rawData.token;
            localStorage.token = rawData.token;
            axiosInstance.defaults.headers.common["Authorization"] = `Bearer ${rawData.token}`;
        },
        logout(state, rawData){
            state.token = "";
            localStorage.removeItem("token");
            axiosInstance.defaults.headers = {};
        },
        createPost(state, post: PostProps) {
            state.posts.push(post);
        },
        fetchColumns(state, rawData) {
            state.columns = rawData.list;
        },
        fetchColumn(state, rawData) {
            state.columns = [rawData];
        },
        fetchPosts(state, rawData) {
            state.posts = rawData.list;
        },
        setLoading(state, rawData) {
            state.loading = rawData;
        },
        setError(state, e: GlobalErrorProps) {
            state.error = e;
        },
    },
    actions: {
        fetchColumns(context) {
            requestAndCommit(getColumns, "fetchColumns", context.commit);
        },
        fetchColumn(context, cid) {
            requestAndCommit(() => getColumn(cid), "fetchColumn", context.commit);
        },
        fetchPosts(context, cid) {
            requestAndCommit(() => getPosts(cid), "fetchPosts", context.commit);
        },
        login({ commit }, payload) {
            return requestAndCommit(() => login(payload), "login", commit);
        },
        fetchCurrentUser({ commit }, payload) {
            return requestAndCommit(getUser, "fetchCurrentUser", commit);
        },
        loginAndFetch({ commit, dispatch }, payload) {
            return dispatch("login", payload).then(() => {
                return dispatch("fetchCurrentUser");
            });
        },
    },
    modules: {},
});
